<template>
  <Title>论文自动化搜索</Title>
  <ShowBox>
    <div class="search-container">
      <el-input 
        v-model="target" 
        style="width: 540px" 
        placeholder="输入搜索内容" 
        size="large" 
      />
      <el-select 
        v-model="index" 
        placeholder="选择搜索类型" 
        clearable 
        style="width: 150px; margin-left: 20px;"
        size="large" 
      >
        
        <el-option label="Id" value="0" />
        <el-option label="标题" value="1" /> 
        <el-option label="作者" value="2" />
        <el-option label="期刊名/ISSN" value="5" /> 
        <el-option label="出版社" value="9" /> 
      </el-select> 
      <el-button type="primary" style="width: 100px;margin-left: 20px;" size="large" @click="paperList">搜索</el-button> 
    </div>
    <el-table 
      :data="tableData" 
      style="width: 100%;margin-top: 20px;" 
      height="650"
    >
      <el-table-column type="index" width="50" />
      <el-table-column prop="title" label="标题" width="650" />
      <el-table-column label="URL">
        <template #default="{ row }">
          <a :href="'https://' + row.url" target="_blank" style="color: #409eff;">
            {{ row.url }}
          </a>
        </template>
      </el-table-column>
    </el-table>
  </ShowBox>
</template>

<script setup name="AutoSearch">
import ShowBox from '@/components/ShowBox.vue'
import Title from '@/components/Title.vue'
import { ref } from 'vue'

// 初始化表单数据
const index =ref()
const target = ref('')

// 初始化表格数据
const tableData = ref([

])


import { paperAnalyser } from '../api/search';

const paperList = async() =>{
  let params ={
    index :index.value?index.value:0,
    target: target.value?target.value:""
  }

  let result = await paperAnalyser(params)
  // tableData.value=result.data
  console.log(result)
}


paperList()
</script>

<style scoped>
.search-container {
  display: flex;
  align-items: center; /* 垂直居中 */
}
</style>
